<template>
	<view class="header">
		<text>{{txt}}</text>
	</view>
</template>

<script>
	export default {
		name:"separate-header",
		props: {
			txt: {
				type: String,
				default: '标题'
			},
		},
		data() {
			return {
				
			};
		}
	}
</script>

<style lang='scss'>

.header {
	display: flex;
	justify-content: center;
	align-items: center;
	
	background: #fff;
	margin-top: 16upx;
	height: 80upx;
	font-size: $uni-font-size-lg;
	color: $uni-text-color-dark;
	position: relative;

	text {
		padding: 0 20upx;
		background: #fff;
		position: relative;
		z-index: 1;
	}

	&:after {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translateX(-50%);
		width: 300upx;
		height: 0;
		content: '';
		border-bottom: 1px solid #ccc;
	}
}
</style>
